import { ReactViewState, ReactView, reactControl, ReactViewControl } from "pao-aop-client";
import React from "react";
import { addon, getObject, Ref } from "pao-aop";
// import { SignPreview } from "src/projects/industryInternetSign/components/sign-preview";
import { match } from "react-router";
import { IAnalysSignService } from "src/models/analyssign";
import { SignPreview } from "src/projects/industryInternetSign/components/sign-preview";
export const HANDCODE = 'HANDCODE';
import queryString from 'query-string';
/**
 * 组件：标识解析视图状态
 */
export interface SignAnalysisViewState extends ReactViewState {
    data: any;// 返回的属性值
}
export let postData = {
    handle_code: "88.168.88/QYMB@12312",
    handle_name: "12312",
    attribute: [
        { index: 101, sign_key: "handle_code", sign_name: "品类标识", sign_type: "TEXT", sign_value: "88.168.95/PLMB@103" },
        { index: 102, sign_key: "handle_name", sign_name: "品类名称", sign_type: "TEXT", sign_value: "这是跳转标识3.0" },
        { index: 104, sign_key: "rc_code", sign_name: "二维码图片", sign_type: "Image", sign_value: "…xIDMzaDF2MWgtMXpNMjcgMzNoMnYxaC0yeiIvPjwvc3ZnPg==" },
        { index: 105, sign_key: "product_type", sign_name: "产品类型", sign_type: "TEXT", sign_value: "14" },
        { index: 107, sign_key: "company_handle_name", sign_name: "企业名称", sign_type: "TEXT", sign_value: "这是企业模板名称1.0" },
        { index: 108, sign_key: "company_handle_code", sign_name: "企业标识码", sign_type: "TEXT", sign_value: "88.168.95/QYMB@1234" },
        { index: 201, sign_key: "handle_code", sign_name: "单品标识", sign_type: "TEXT", sign_value: "88.168.95/301" },
        { index: 202, sign_key: "handle_name", sign_name: "单品名称", sign_type: "TEXT", sign_value: "这是单品301" },
        { index: 204, sign_key: "rc_code", sign_name: "二维码图片", sign_type: "Image", sign_value: "…NOSAzM2gxdjFoLTF6TTMyIDMzaDF2MWgtMXoiLz48L3N2Zz4=" },
        { index: 208, sign_key: "company_handle_name", sign_name: "企业名称", sign_type: "TEXT", sign_value: "这是企业模板名称1.0" },
        { index: 209, sign_key: "company_handle_code", sign_name: "企业标识码", sign_type: "TEXT", sign_value: "88.168.95/QYMB@1234" },
        { index: 210, sign_key: "category_handle_name", sign_name: "品类名称", sign_type: "TEXT", sign_value: "这是跳转标识3.0" },
        { index: 211, sign_key: "category_handle_code", sign_name: "品类标识码", sign_type: "TEXT", sign_value: "88.168.95/PLMB@103" },
        { index: 301, sign_key: "handle_code", sign_name: "企业标识", sign_type: "TEXT", sign_value: "88.168.95/QYMB@1234" },
        { index: 302, sign_key: "handle_name", sign_name: "企业名称", sign_type: "TEXT", sign_value: "这是企业模板名称1.0" },
        { index: 304, sign_key: "rc_code", sign_name: "二维码图片", sign_type: "Image", sign_value: "…5IDM3aDJ2MWgtMnpNMjYgMzdoMXYxaC0xeiIvPjwvc3ZnPg==" },
        { index: 305, sign_key: "company_picture", sign_name: "企业照片", sign_type: "Image", sign_value: ["https://ss0.bdstatic.com/94oJfD_bAAcT8t7mm9GUKT-xh_/timg?image&quality=100&size=b4000_4000&sec=1554314699&di=e320d993c25f985ac79a844678e17d73&src=http://pic2.ooopic.com/10/80/92/78b1OOOPIC84.jpg"] },
        { index: 306, sign_key: "industry_type", sign_name: "行业类型", sign_type: "TEXT", sign_value: "A00" },
        { index: 307, sign_key: "organization", sign_name: "组织机构代码", sign_type: "TEXT", sign_value: "" },
        { index: 308, sign_key: "mobile", sign_name: "手机号码", sign_type: "Phone", sign_value: "" },
        { index: 309, sign_key: "tel", sign_name: "固定电话", sign_type: "Phone", sign_value: "" },
        { index: 310, sign_key: "fax", sign_name: "传真", sign_type: "Phone", sign_value: "" },
        { index: 311, sign_key: "email", sign_name: "电子邮箱", sign_type: "EMAIL", sign_value: "" },
        { index: 312, sign_key: "address", sign_name: "公司地址", sign_type: "TEXT", sign_value: "" },
        { index: 313, sign_key: "introduce", sign_name: "公司介绍", sign_type: "TEXT", sign_value: "" },
        { index: 314, sign_key: "website", sign_name: "公司官网", sign_type: "TEXT", sign_value: "" },
        { index: 315, sign_key: "custom_attribute", sign_name: "自定义属性", sign_type: "TEXT", sign_value: Array(0) }
    ]
};

/**
 * 组件：标识解析视图
 * 描述
 */
export class SignAnalysisView extends ReactView<SignAnalysisViewControl, SignAnalysisViewState> {
    // static getDerivedStateFromProps(nextProps: any, state: any) {
    // // Should be a controlled component.
    // if ('value' in nextProps && state.comps_value.length === 0) {
    // return {
    // // comps: [...(nextProps.value || [])],
    // data: [...(nextProps.value || [])]
    // };
    // }
    // return null;
    // }

    constructor(props: any) {
        super(props);
        this.state = {
            data: null
        };

    }
    getdataService() {
        return getObject(this.props.IAnalysSignService_Fac!);
    }
    componentDidMount() {
        let id = queryString.parse(location.search).key + '';
        this.getdataService!()!.analys!(id)!.then((data: any) => {
            if (data && data.handle_type === 'external_links') {
                // if (data.link_website.indexOf('http') > -1) {
                window.location.href = data.link_website;
                // } else {
                // window.location.href = 'https://' + data.link_website;
                // }

            } else {
                this.setState({ data });
            }
        }).catch(error => {
            console.log(error);
        });
    }
    render() {
        let { data } = this.state;
        // let data = postData;
        return (
            <div>
                {
                    data ? <SignPreview data={data} showCode={true} />
                        : (data !== null ?
                            <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center' }}>
                                <img src={require('/src/projects/industryInternetSign/components/sign-preview/img/sign_no.png')} style={{ width: '100%' }} />
                            </div> : '')}
            </div>
        );
    }
}

/**
 * 控件：标识解析视图控制器
 * 描述
 */
@addon('SignAnalysisView', '标识解析视图', '描述')
@reactControl(SignAnalysisView, true)
export class SignAnalysisViewControl extends ReactViewControl {
    public IAnalysSignService_Fac?: Ref<IAnalysSignService>;
    match?: match<{ [HANDCODE]: string }>;

}